<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 一、为什么把 方法放在 prototype上；
        // 节约性能 ，prototype 是构造函数里给所有对象开辟的一个公共空间

        // function Person(name){
        //     this.name = name;
        //     // this.fn = function(){
        //     //     console.log("fn");
        //     // }
        // }
        // Person.prototype.fn = function(){
        //     console.log("fn");
        // }

        // var zhangsan = new Person("张三");
        // var lisi = new Person("李四");
        // zhangsan.fn();
        // lisi.fn();
        // console.log(zhangsan.fn === lisi.fn);


        // 二、原型的继承

        function Dad(height){
            this.height = height;
        }
        Dad.prototype.fn = function(){
            console.log("fn");
        }


        function Son(name,height){
            Dad.call(this,height);
            this.name = name;
        }

        // 直接把 父类的原型赋值给子类的原型；
        // Son.prototype = Dad.prototype;  // 可以实现 ，造成引用问题 

        // 组合继承 
        function Link(){};
        Link.prototype = Dad.prototype;
        Son.prototype = new Link();

        Son.prototype.fn = function(){
            console.log("sonFn");
        }

        var zhangsan = new Son("张三","178cm");
        console.log(zhangsan);
        zhangsan.fn();

        var dadObj = new Dad("180cm");
        dadObj.fn();


        // 作业 ： 实现2个拖拽 1.构造函数实现 2.通过继承 扩展 拖拽的功能 ，把拖拽加边界。
        // 项目；



    </script>
</body>
</html>